<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>练习异步请求Get请求</title>
</head>

<body>

    
    <div>
        请选择你的地址:
        <select name="province" id="province">
            <option value="">请选择</option>
            <option value="河南省">河南省</option>
            <option value="北京市">北京市</option>
            <option value="山东省">山东省</option>
        </select>
        <select name="city" id="city">
            <option value="">请选择城市</option>
        </select>
    </div>
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script>
        $("#province").change(function () {
            let name = $("#province :selected").val();
            $.get(
                "https://mock.apipost.cn/app/mock/project/735a2577-da8b-467d-b76c-09349f9d8f3c/address",
                { name: name },
                function (res) {
                    var cityStr = "";
                    var data = res.data
                    for (var key in data) {
                        cityStr += "<option value=" + key + ">" + data[key] + "</option>"
                    }
                    $("#city").html(cityStr)
                }
            )
        })
    </script>
</body>

</html>